<template>
    <page-header-wrapper>
        <a-card :bordered="false"
                title="所有数据的定期本地打包和推送403的时间设置">

            <a-form-model ref="ruleForm" :model="ruleForm" :rules="rules"
                          v-bind="queryFormItemLayout">
                <a-row :gutter="20">
                    <a-col :md="12" :sm="24">
                        <a-form-model-item label="本地打包时间设置" prop="localPackingTime">
                            <a-select v-model="ruleForm.localPackingTime"
                                      allowClear
                                      placeholder="请选择">
                                <a-select-option
                                    v-for="item in userList"
                                    :key="item.value"
                                    :value="item.value"
                                >{{ item.name }}
                                </a-select-option>
                            </a-select>
                        </a-form-model-item>
                    </a-col>
                </a-row>
                <a-row :gutter="20">
                    <a-col :md="12" :sm="24">
                        <a-form-model-item label="推送403时间设置" prop="pushTime">
                            <a-select v-model="ruleForm.pushTime"
                                      allowClear
                                      placeholder="请选择">
                                <a-select-option
                                    v-for="item in userList"
                                    :key="item.value"
                                    :value="item.value"
                                >{{ item.name }}
                                </a-select-option>
                            </a-select>
                        </a-form-model-item>
                    </a-col>
                </a-row>
                <a-row>
                    <a-col :md="12" :sm="24">
                        <a-form-item :colon="false" label=" ">
                            <a-button type="primary" @click="onSubmit">
                                确认
                            </a-button>
                        </a-form-item>
                    </a-col>
                </a-row>
            </a-form-model>
        </a-card>
    </page-header-wrapper>
</template>

<script>
import { getDataDate, updateDataDate } from '@/api/api'

export default {
  data () {
    return {
      queryFormItemLayout: {
        labelCol: {
          xs: { span: 24 },
          sm: { span: 5 }
        },
        wrapperCol: {
          xs: { span: 24 },
          sm: { span: 16 }
        }
      },
      ruleForm: {
        id: undefined,
        localPackingTime: '',
        pushTime: ''
      },
      rules: {
        localPackingTime: [{ required: true, message: '选择不能为空' }],
        pushTime: [{ required: true, message: '选择不能为空' }]
      },
      userList: []
    }
  },
  created () {
    for (let i = 1; i < 25; i++) {
      this.userList.push({
        value: i,
        name: i + '时'
      })
    }
    getDataDate().then(res => {
      console.log(res)
      this.ruleForm.id = res.id
      this.ruleForm.localPackingTime = res.localPackingTime
      this.ruleForm.pushTime = res.pushTime
    })
  },
  methods: {
    onSubmit () {
      this.$refs.ruleForm.validate((valid) => {
        console.log(valid)
        if (valid) {
          updateDataDate(this.ruleForm).then(res => {
            this.$message.success(res.msg)
          })
        }
      })
    }
  }
}
</script>

<style>

</style>
